<template>
    <div>
        <el-avatar :class="avatar" :size="80"> {{ student.userName }} </el-avatar>
       
    </div>
</template>
<script>
export default{
    name:"Student",
    props:{
        student:{
            type:Object,
            default:null
        }
    },
    data(){
        return{
           
        }
    } ,
    
    computed:{
        avatar(){
                switch (this.student.showState) {
                    case 1:
                        return "avatar-yes"
                        break;
                    case -1:
                        return "avatar-no";
                    default:
                        break;
                }
            
            }

           
    }
} 
</script>
<style scoped>
.avatar-no {
    background-color:red;
}
.avatar-yes {
    background-color:green;
}
</style>
